/**
 * @Description: 控件抽象类
 * @author Beon
 * @date 2021/6/28
*/
import DropBox from './dropBox';
import {canDropInBox} from '../types/base';
import Container from './container';
import Plant from './plant';
import HtmlToCanvas from '../utils/htmlToCanvas';
import DropControl from '../utils/dropControl';

export default abstract class Widget extends DropBox implements canDropInBox{
	// 数组位置信息(避免重复计算)
	$index: number
	// 父对象
	$parent: Container | Plant

	protected constructor(props) {
	    super(props);
	}

	/**
	 * 注册拖动开始事件
	 */
	mouseDownReg(): void {
	    this.$el.addEventListener('mousedown', this.beforeDropBind);
	}

	/**
	 * 拖动前事件
	 * @param e
	 * @returns {Promise<void>}
	 */
	async beforeDropDeal(e: MouseEvent): Promise<void> {
	    // TODO 进行控件选中
	    // TODO 进行拖拽开始
	    await HtmlToCanvas.createCanvas(this.$el, e);
	    this.$el.style.opacity = '0.8';
	}

	/**
	 * 拖动时事件
	 * @param e
	 */
	dropMoveDeal(e: MouseEvent): void {
	    HtmlToCanvas.moveCanvas(e);
	    DropControl.dropMove(e);
	}

	/**
	 * 拖动后事件
	 * @param e
	 * @returns {Promise<void>}
	 */
	async dropOverDeal(e: MouseEvent): Promise<void> {
	    HtmlToCanvas.stopCanvas(e);
	    this.$el.style.opacity = '';
	    await DropControl.setDropBox(this, e);
	}

	/**
	 * 设置parent
	 * @param parent
	 */
	setParent(parent:Container | Plant): void {
	    this.$parent = parent;
	}
}
